<!DOCTYPE html>
<html>

<head>
    <title>Example</title>
    <meta name="author" content="Adam Freeman" />
    <meta name="description" content="A simple example" />
    <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico">
    <style>
        ol {
            list-style-type: lower-alpha;
        }
        ul{
            list-style-image: url('../images/apple.png');
        }
        /* 标记在内容框的内部还是外部 */
        li.inside{
            list-style-position: inside;
        }
        li.outside{
            list-style-position: outside;
        }
    </style>
</head>

<body>
    I like apples and oranges.

    I also like:
    <ol>
        <li class="inside">bananas</li>
        <li class="inside">mangoes</li>
        <li style="list-style-type: decimal" class="inside">cherries</li>
        <li class="outside">plums</li>
        <li class="outside">peaches</li>
        <li class="outside">grapes</li>
    </ol>
    <ul>
        <li>bananas</li>
        <li>mangoes</li>
        <li style="list-style-type: decimal">cherries</li>
        <li>plums</li>
        <li>peaches</li>
        <li>grapes</li>
    </ul>
</body>

</html>